---
title: 'How to reset state'
---

# How to reset state

In some cases, you might want to reset the state in your proxy instance to its initial values. For example, you are storing form values or some other ephemeral UI state that you want to reset. It turns out this is quite simple to do!

```js
import { proxy } from 'valtio'
import { deepClone } from 'valtio/utils'

const initialObj = {
  text: 'hello',
  arr: [1, 2, 3],
  obj: { a: 'b' },
}

const state = proxy(deepClone(initialObj))

const reset = () => {
  const resetObj = deepClone(initialObj)
  Object.keys(resetObj).forEach((key) => {
    state[key] = resetObj[key]
  })
}
```

Note that we're using the `deepClone()` utility function from `valtio/utils` to copy the initial object in _both_ the `reset` function and the `state` proxy. Using deepClone in the proxy function is a new requirement in v2. Valtio no longer clones the initial state by default. If you reuse the object you pass into the proxy function, you may get unexpected results.

Alternatively, you can store the object in another object, which make the reset logic easier:

```js
const state = proxy({ obj: initialObj })

const reset = () => {
  state.obj = deepClone(initialObj)
}
```

<br />

<blockquote className="note">
ℹ️ &nbsp; Note

Using `structuredClone()`

<br />

In 2022, there was a new global function added called `structuredClone` that is widely available in most modern browsers. You can use `structuredClone` in the same way as `deepClone` above, however `deepClone` is preferred as it will be aware of any `ref`s in your state.

</blockquote>

> Note: deepClone will convert proxyMap and proxySet back to plain objects. If you have an object that has these within its tree, consider using `unstable_deepProxy` instead.
